<template>
	<view>
		<carHeader :title="'商户资料'"></carHeader>
		<view class="only">
			<view class="one">
				<p>
					<span>负责人：</span>
					<span>{{items.merchantVerification.director}}</span>
				</p>
				<p>
					<span>身份证号码：</span>
					<span>{{items.merchantVerification.idCard}}</span>
				</p>
				<p>
					<span>手机号：</span>
					<span>{{items.merchantVerification.mobile}}</span>
				</p>
				<p>
					<span>店名：</span>
					<span>{{items.merchantName}}</span>
				</p>
				<p>
					<span>工商营业执照号码：</span>
					<span>{{items.merchantVerification.businessLicenseId}}</span>
				</p>
				<p>
					<span>经营区域：</span>
					<span>{{items.province}}{{items.city}}{{items.district}}</span>
				</p>
				<p>
					<span>经营地址：</span>
					<span>{{items.address}}</span>
				</p>
			</view>
			<view class="two">
				<view class="shop1">
					商家简介
				</view>
				<view class="shop2">
					{{items.description}}
				</view>
			</view>
			<view class="three">
				<view class="three1">
					身份证正反照片
				</view>
				<view class="three2">
					<image :src="this.front" mode="aspectFit"></image>
					<image :src="this.opposite" mode="aspectFit"></image>
				</view>
			</view>
			<view class="four">
				<view class="four1">
					营业执照
				</view>
				<view class="four2">
					<image :src="this.businessLicenseImg" mode="aspectFit"></image>
				</view>
			</view>
			<view class="four">
				<view class="four1">
					门店照片
				</view>
				<view class="four2">
					<image :src="this.img" mode="aspectFit"></image>
				</view>
			</view>
			<div>
								<button class="button1"  type="primary" @click="submit()">修改</button>
							</navigator>
						</div>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				items:{
					merchantVerification:'',
				},
				front:'',
				opposite:'',
				businessLicenseImg:'',
				img:'',
				merchantId:'2',
			};
		},
		onShow() {
			uni.request({
				url:'http://localhost:8080/carShop/carShop/merchant/list?merchantId='+this.merchantId,
				success: (res) => {
					console.log(res);
					this.items=res.data[0];
					this.front=this.items.merchantVerification.front;
					this.opposite=this.items.merchantVerification.opposite;
					this.businessLicenseImg=this.items.merchantVerification.businessLicenseImg;
					this.img=this.items.merchantImgs.img;
				},
			})
		},
		onLoad() {
			console.log(uni.getStorage("token"))
		},
		methods:{
			submit(){
				uni.navigateTo({

					url:"/pages/updateziliao/updateziliao"
				})
			}
		}
	}
</script>

<style lang="scss">
.only{
	margin: 0 20rpx;
	position: relative;
	top: -240rpx;
	.one{
		font-weight: 550;
		font-size: 30rpx;
		background-color: #fff;
		border-radius: 50rpx;
		padding: 40rpx 30rpx;
		p {
			margin-top: 20rpx;
			display: flex;
			justify-content: space-between;
		}
	}
	.two {
		background-color: #fff;
		border-radius: 50rpx;
		padding: 40rpx 30rpx;
		margin-top: 20rpx;
		.shop1 {
			font-weight: 550;
			font-size: 30rpx;
		}
		.shop2 {
			margin-top: 20rpx;
			font-size: 24rpx;
			color: #b4b4b4;
		}
	}
	.three {
		background-color: #fff;
		border-radius: 50rpx;
		padding: 40rpx 30rpx;
		margin-top: 20rpx;
		.three1 {
			font-weight: 550;
			font-size: 30rpx;
		}
		.three2 {
			width: 500rpx;
			height: 160rpx;
			image {
				position: relative;
				top: -150rpx;
				width: 200rpx;
				margin-right: 40rpx;
			}
		}
	}
	.four {
		background-color: #fff;
		border-radius: 50rpx;
		padding: 40rpx 30rpx;
		margin-top: 20rpx;
		.four1 {
			font-weight: 550;
			font-size: 30rpx;
		}
		.four2 {
			width: 500rpx;
			height: 160rpx;
			image {
				position: relative;
				top: -150rpx;
				width: 200rpx;
				margin-right: 40rpx;
			}
		}
	}
}
.button1{
	width: 90%;
	margin-top: 20rpx;
}
</style>
